<template>
  <j-modal
    :title="title"
    :width="width"
    :footer="footer"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model">
        <a-row>
          <f-render
            v-model="formData"
            :request-fn="handleSubmit"
            @request-success="handleSuccess"
            :config="formConfig"
            height="calc(100vh - 60px)"
            pure
          />
        </a-row>
      </a-form-model>
    </a-spin>
  </j-modal>
</template>

<script>
  import { getAction,postAction,putAction } from '@/api/manage'
  export default {
    name: 'DesignFormDataModal',
    components: {
    },
    props:{
      mainId:{
        type:String,
        required:false,
        default:''
      }
    },
    data () {
      return {
        title:"表单数据",
        width:"800",
        footer:"null",
        visible: false,
        model:{
        },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },

        confirmLoading: false,

        loading: false,
        formData: {},
        formConfig: "",

        url: {
          getMainById:"/desform/lbDesform/queryById",
          add: "/desform/lbDesform/add",
          edit: "/desform/lbDesform/edit",
        }
      }
    },
    created () {
      //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    mounted() {

    },
    methods: {
      handleSubmit(data) {
        this.close();
      },
      handleSuccess() {
        this.close();
      },
      edit (record) {
        this.model = Object.assign({}, record);
        this.formData=this.model.desformDataJson;
        this.visible = true;
        // 模拟异步加载
        this.loading = true;

          getAction(this.url.getMainById, {id:this.model.desformId}).then((res) => {
            if (res.success) {
              this.formConfig = res.result.desformDesignJson || "";
            }
            this.loading = false;
          }).finally(() => {
            that.confirmLoading = false;
            that.close();
          })

      },
      close () {
        this.$emit('close');
        this.visible = false;
        this.$refs.form.clearValidate();
      },

      handleOk () {
        this.close()
      },
      handleCancel () {
        this.close()
      },

    }
  }
</script>

<style scoped>

</style>